<div class="container-fluid">
  <div class="row">
    <div class="col-lg-3">
      <div class="form-group">
        <label>From</label>
        <div class="input-group">
          <input class="form-control" placeholder="yyyy-mm-dd"
                 name="dp1" [(ngModel)]="startDate" ngbDatepicker #d1="ngbDatepicker">
          <div class="input-group-append">
            <button class="btn btn-outline-secondary calendar" (click)="d1.toggle()" type="button"></button>
          </div>
        </div>
        <ngb-timepicker [(ngModel)]="startTime" [seconds]="true"></ngb-timepicker>
      </div>

      <div class="form-group">
        <label>To</label>
        <div class="input-group">
          <input class="form-control" placeholder="yyyy-mm-dd"
                 name="dp2" [(ngModel)]="endDate" ngbDatepicker #d2="ngbDatepicker">
          <div class="input-group-append">
            <button class="btn btn-outline-secondary calendar" (click)="d2.toggle()" type="button"></button>
          </div>
        </div>
        <ngb-timepicker [(ngModel)]="endTime" [seconds]="true"></ngb-timepicker>
      </div>
    </div>
    <div class="col-lg-9">
      <div class="container-fluid">
        <div *ngFor="let message of messages" class="container-fluid">
          <div class="card">
            <div class="card-body">
              <p class="card-text">{{ message.body }}</p>
              <div class="row">
                <div class="col-lg-2">
                  <a routerLink="/message/{{message.username}}" class="card-link text-danger">{{ message.username }}</a>
                </div>
                <div class="col-lg-5">
                  <span class="card-text text-success">{{ message.moment }}</span>
                </div>
                <div class="col-lg-5">
                  <a *ngFor="let tag of message.tags" (click)="onSelect(tag)" routerLink="/tag/{{tag.name}}" class="card-link text-info">{{ tag.name }}</a>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</div>